<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta property="qc:admins" content="07216227476305205456375" />
<title>网贝首页--定制</title>

<script src="jquery/js/jquery-1.8.2.js"></script>
<script src="jquery/js/jquery-ui-1.8.23.custom.js"></script>

<link rel="stylesheet"
	href="jquery/css/ui-lightness/jquery-ui-1.9.0.custom.css" />
<link rel="stylesheet" type="text/css"
	href="/webbei/js/bgjs/css/index.css" />
<link rel="stylesheet" type="text/css" href="css/custom.css" />
<link rel="stylesheet" type="text/css" href="css/login.css" />


<link rel="Stylesheet" type="text/css" href="inc/wColorPicker.css" />
<script type="text/javascript" src="inc/wColorPicker.js"></script>

<link rel="Stylesheet" type="text/css" href="wPaint.css" />
<script type="text/javascript" src="wPaint.js"></script>


<script type="text/javascript" src="js/login.js"></script>
<script type="text/javascript" src="js/bgjs/js/script.js"></script>
<script type="text/javascript" src="js/customjs/custom.js"></script>



<style type="text/css">
html {
	overflow: scroll;
}

.btn_queding {
	border: solid 1px #666;
	padding: 2px;
	width: 65px;
	filter: progid.DXImageTransform.Microsoft.Gradient(GradientType=0,
		StartColorStr=#ffffff, EndColorStr=#ECE9D8 );
}

.button1 {
	border: solid 2px #dcdcdc;
	padding: 4px 14px 4px 34px;
	color: #959595;
	background: url("images/ok.gif") no-repeat 8px center;
	background-color: #f9f9f9;
	font-family: "Arial", "Tahoma", "微软雅黑", "雅黑";
	vertical-align: middle;
	margin: 2px;
	line-height: 18px;
	font-size: 10px;
}
</style>
<%-- <script type="text/javascript">
//function refreshShopCarCount(){
//	var a = <%=request.getSession().getAttribute("countshopcar")%>;
//	alert(a);
//	document.getElementById("shopcarcount").innerHTML=a;
//}
</script> --%>

</head>

<body style="width:100%;margin:0px; padding:0px;">

	<input type="hidden" value="${picdetaillistsize}"
		id="hiddenpicdetaillistsize" />
	<input type="hidden" value="${customId }" id="hiddencustomid" />

	<c:if test="${flag==0}">
		<input type="hidden" value="1" id="hiddenBgPic" />
	</c:if>


	<img src="img/022.gif" id="loading_img"
		style="display:none;position:absolute;z-index:999;" />
	<div id="fancybox-overlay"
		style="background-color: rgb(119, 119, 119); height: 1823px; 
		opacity: 0.7; cursor: pointer; display: none; "
		onclick="viewclose()"></div>
	<div id="paintBody"
		style="position:absolute;z-index:1101;display: none; width: 630px; top: 100px; left: 431px; height: auto">
		<div id="wPaint"
			style="position:relative; width:500px; height:300px; background:#CACACA; border:solid black 1px; overflow:hidden;">
		</div>
		<br />
		<div style="float:left;margin-left:50px">
			<input type="button" value="确定" onClick="saveImage()"
				style="border:0;background-color:#94b8e9" /> <input type="button"
				value="清空" onClick="clearCanvas()"
				style="border:0;background-color:#94b8e9" />
		</div>
	</div>

	<div id="fancybox-wrap"
		style="display: none; width: 630px; top: 88px; left: 431px; height: auto; ">
		<div id="fancybox-outer">
			<div class="fancybox-bg" id="fancybox-bg-n"></div>
			<div class="fancybox-bg" id="fancybox-bg-ne"></div>
			<div class="fancybox-bg" id="fancybox-bg-e"></div>
			<div class="fancybox-bg" id="fancybox-bg-se"></div>
			<div class="fancybox-bg" id="fancybox-bg-s"></div>
			<div class="fancybox-bg" id="fancybox-bg-sw"></div>
			<div class="fancybox-bg" id="fancybox-bg-w"></div>
			<div class="fancybox-bg" id="fancybox-bg-nw"></div>
			<div id="fancybox-content"
				style="width: 610px; height: 480px; border-top-width: 10px; 
				border-right-width: 10px; border-bottom-width: 10px; border-left-width: 10px; ">
				<img id="fancybox-img" src="" alt="">
			</div>
			<a id="fancybox-close" style="display: block; " onClick="viewclose()"></a>
			<a href="javascript:;" id="fancybox-left" style="display: none; ">
				<span class="fancy-ico" id="fancybox-left-ico"></span> </a> <a
				href="javascript:;" id="fancybox-right" style="display: none; ">
				<span class="fancy-ico" id="fancybox-right-ico"></span> </a>
			<div id="fancybox-title" class="" style="display: none; "></div>
			<br /> <input type="button" value="保存到购物车"
				style="border-style:dashed;font-size:15" onClick="getCustomName()" />
			&nbsp;&nbsp;&nbsp;&nbsp; <input type="button" value="直接付款"
				style="border-style:dashed;font-size:15" onClick="payForCustom()" />
		</div>
	</div>
	<jsp:include page="top.jsp"></jsp:include>
	<div id="custom_content">

		<div id="leftSelectDiv"
			style="position:absolute;z-index:900;width:190px;padding:0px;outline:0;border:0px solid #a0b3d6;word-wrap:break-word;float:left;text-align:left;left: 235px; top: 83px;">
			<div id="chanping"
				style="background-color:slategray;width:154px;height:20px;color:white;float:left;clear:right;text-align:left;">
				<span style="width:100;padding-left:3px;">产品</span><span
					onclick="minProduct()"
					style="width:14;border-width:0px;color:white;float:right;cursor:default;">_</span>

			</div>
			<div id="leftlist"
				style="position:relative;border-left:slategray solid 3px;border-right:slategray solid 3px;border-top:0;border-bottom:slategray solid 3px;">
				<div id="productSelect">
					<img id="plbutton" src="img/custom_select_pro.gif"
						style="cursor:pointer;" />
					<ul id="productlist" style="display:none;">
						<c:forEach items="${applicationScope.product}" var="p">
							<li><a href="showCustom.action?productId=${p.productId }">${p.productName
									}</a></li>
						</c:forEach>
					</ul>
				</div>
				<div id="typeSelect">
					<img src="img/custom_type.gif" />
					<div style="height:454px;overflow-y: auto;width:148px;">
					<ul style="list-style:none;margin-left:20px;">
						<c:forEach items="${list}" var="fli">
							<li><a href="javascript:void(0);" id="${fli.brandsId}"
								onclick="zhan1(${fli.brandsId})"><img
									id="tupian${fli.brandsId}" src="img/nolines_plus.gif"> </a>
								${fli.brandsName}
								<div id="second${fli.brandsId}" style="display:none"
									isclick="false">
									<ul id="uu${fli.brandsId}"></ul>
								</div></li>
						</c:forEach>
					</ul></div>
				</div>
			</div>
		</div>
		<div id="bg"
			style="left:191px;background:url('${bgPic}') no-repeat scroll center bottom transparent;">
			<%
				int tt = 0;
			%>
			<c:forEach items="${picdetaillist}" var="p">
				<div id="divv<%=tt%>"
					style="position:absolute;left:${p.left};top:${p.top };width:${p.width };height:${p.height }">
					<div style="height:10px;display:block" id="chacha<%=tt%>">
						<img id="imgc<%=tt%>" src="img/cancel_03.png" value="<%=tt%>"
							style="display: block; position: relative; left: -10px; float: left; width: 12px; height: 10px;" />
					</div>
					<input type="hidden" value="1" id="flag<%=tt%>" name="flagname" />
					<img id="imgg<%=tt++%>" src="${p.picUrl }"
						style="width:${p.width };height:${p.height }" />
				</div>
			</c:forEach>

		</div>
		<div id="tooltip" style="float:left;clear: both; position: absolute; float: left; left: 1031px; top: 83px;">
			<div id="gongjukuang"
				style="background-color:slategray;width:200;height:20;color:white;clear:right;text-align:left;border-left:slategray solid 3px;border-right:slategray solid 3px;border-top:#000 solid 3px;border-bottom:slategray solid 0px;">
				<span style="width:100;padding-left:3px;">工具框</span> <span
					onclick="min()"
					style="width:14;border-width:0px;color:white;float:right;cursor:default;">_</span>
			</div>
			<div id="custom_choose"
				style="position:relative;height:492px;border-left:slategray solid 3px;border-right:slategray solid 3px;border-top:#000 solid 0px;border-bottom:slategray solid 3px;">
				<!-- 右边选择框体 -->
				<img src="img/yulan_03.png"
					style="margin-top:5px;width:90px;height:30px;cursor:pointer;"
					onclick="yulan()" />
				<!-- 预览按钮动作 -->
				<img src="img/clear_03.png"
					style="width:90px;height:30px;cursor:pointer;" onClick="clearall()" />

				<img alt="打开画板" src="img/painter.png" width="190px" height="20px"
					onclick="openPainter()"> <img src="img/diypic_03.png"
					width="190px" height="20px" />
				<!-- 这个图片是个性图标的图片 -->
				<div id="Carpic" style="height:200px;overflow-y: auto">
					<img src="img/2B2149362.png" class="diypic"
						onclick="addimg('img/2B2149362.png')" />
					<!-- addimg：中间框体添加图片动作 -->
					<img src="img/652149827.png" class="diypic"
						onclick="addimg('img/652149827.png')" /> <img
						src="img/C221414356.png" class="diypic"
						onclick="addimg('img/C221414356.png')" /> <img
						src="img/7A21411631.png" class="diypic"
						onclick="addimg('img/7A21411631.png')" /> <img
						src="img/8921411865.png" class="diypic"
						onclick="addimg('img/8921411865.png')" />
				</div>
				<img src="img/wordadd_03.png" width="190px" height="20px" />
				<form id="addword" method="post">
					<textarea name="word"
						style="width:180px;height:40px;margin-top:4px;resize:none"></textarea>
					<div style="float:right;width:40px;margin-top:4px;">
						<select onChange="changeSelectSize(this.value)" id="sizeselect"
							style="float:right;width:50px;height:20px">
						</select>

						<%-- <c:if test="${productId=='1'}">
						<input type="text" name="size" id="fontsize" value="88"
							onblur="javascript:if(this.value==''){alert('请选择字体大小！');this.value='88';}"
							style="width:35px;height:20px;position:relative;top:-20px;left:-11px;" />
					</c:if>
					<c:if test="${productId=='2'}">
						<input type="text" name="size" id="fontsize" value="188"
							onblur="javascript:if(this.value==''){alert('请选择字体大小！');this.value='88';}"
							style="width:35px;height:20px;position:relative;top:-20px;left:-11px;" />
					</c:if>
					<c:if test="${productId=='3'}">
						<input type="text" name="size" id="fontsize" value="20"
							onblur="javascript:if(this.value==''){alert('请选择字体大小！');this.value='88';}"
							style="width:35px;height:20px;position:relative;top:-20px;left:-11px;" />
					</c:if>
					<c:if test="${productId=='4'}">
						<input type="text" name="size" id="fontsize" value="70"
							onblur="javascript:if(this.value==''){alert('请选择字体大小！');this.value='88';}"
							style="width:35px;height:20px;position:relative;top:-20px;left:-11px;" />
					</c:if>
					<c:if test="${productId=='5'}"> --%>
						<input type="text" name="size" id="fontsize" value="88"
							onblur="javascript:if(this.value==''){alert('请选择字体大小！');this.value='88';}"
							style="width:35px;height:20px;position:relative;top:-20px;left:-11px;" />

						<div onClick="coloropen(event)" id="custom_color"
							style="width:40px;height:15px;cursor:pointer;border:1px solid #000;
					background:#000;float:right;margin-top:4px;">
						</div>
						<div id="colorpane"
							style="position:absolute;z-index:999;display:none;"></div>
						<input type="hidden" name="color" value="rgb(0, 0, 0)" />
					</div>
					<select id="fontfamilyselect" style="width:130px;height:20px"
						onchange="changeSelectFamily(this.value)">
					</select>
					<!-- <input type="text" value="楷体" name="family" id="fontfamily" onfocus="addAutocomplete()" 
				style="width:115px;height:20px;position:relative;top:-20px;left:-8px;" disabled="disabled"/> -->
					<input type="text" value="楷体" name="family" id="fontfamily"
						style="width:115px;height:20px;position:relative;top:-20px;left:-8px;"
						disabled="disabled" /> <br /> <input type="button"
						style="border:0;background-color:#94b8e9" value=" 确定 "
						onclick="addword()" /> <input type="reset" value=" 清空 "
						style="border:0;background-color:#94b8e9" />
				</form>
				<img src="img/localpic_03.png" width="190px" height="20px" />
				<form action="picupload.action" id="form1" name="form1"
					encType="multipart/form-data" method="post" target="hidden_frame"
					style="text-align:left;font-size:14px;">

					<!-- <p><input type="text" id="txt" name="txt" style="position:relative;left:0px;width:140px;top:0;height:24px"/></p>
    	 		<p><INPUT type="submit" value="上传文件" style="position:relative;left:140px;width:60px;top:-24px;height:24px;border:0;background-color:#94b8e9"/></p>
    	 		<p><input type="file" onchange="txt.value=this.value" name="myfile" size="17px" style="width:200px;height:24px" /></p> -->
					<input type="text" id="txt" name="txt"
						style="position:relative;left:0px;width:140px;top:5px;height:24px;border:0;"
						value="点击此处选择图片" /> <input type="file" id="file"
						onchange="txt.value=this.value" name="myfile" size="17px"
						style="width:200px;height:24px;position:relative;left:0;top:-19px;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;" />
					<input type="submit" value="上传"
						onmouseover="this.style.borderColor='#75cd02';"
						onmouseout="this.style.borderColor='#dcdcdc';" class="button1"
						style="position:relative;left:133px;width:65px;top:-43px;height:24px" />

					<iframe name='hidden_frame' id="hidden_frame" style="display:none;"></iframe>
				</form>
				<script type="text/javascript">
				function callback() {
					document.getElementById("file").outerHTML = document.getElementById("file").outerHTML;
				}
			</script>
			</div>
		</div>
		<div style="height:auto">
			<c:if test="${bgpiclist!='[]'}">
				<div style="margin-left:110px;clear:both;position:absolute;width:750px;top:600px;">
					<div class="bx_wrap">
						<a class="prev" href="">left</a><a class="next" href="">right</a>
						<div class="bx_container">
							<ul id="example1">
								<c:forEach items="${bgpiclist }" var="bg">
									<li><img height="107" width="107"
										onclick="changeBg('${bg.picUrl}');" src="${bg.picUrl}">
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
				</div>
			</c:if>
		</div>
	</div>
<div style="position:absolute;top:720px;left:250px;"><jsp:include page="bottom.jsp"></jsp:include></div>
	<input type="hidden" value="" id="forname" />
	<div id="inputdesignmsg">
		<fieldset>
			请给你的设计取个名字：<input type="text" id="inputcustomname"
				class="text ui-widget-content ui-corner-all" value="${customname }" /><br />
			您也可以给您的设计添加备注：<input type="text" id="inputcustomcontent"
				class="text ui-widget-content ui-corner-all"
				value="${customcontent}" /><br /> <br />
		</fieldset>
		<input type="button" onClick="inputCustomMsgButton()" value="确定"
			class="btn_queding" />
	</div>
	<%-- <div id="inputdesignmsg1">
		<fieldset>
			请给你的设计取个名字：<input value="${customname }" type="text"
				id="inputcustomname1" class="text ui-widget-content ui-corner-all" /><br />
			您也可以给您的设计添加备注：<input value="${customcontent}" type="text"
				id="inputcustomcontent1"
				class="text ui-widget-content ui-corner-all" /><br />
			<br />
		</fieldset>
		<input type="button" onclick="inputCustomMsgButton1()" value="确定"
			class="btn_queding" />
	</div> --%>
</body>
</html>
